{{template Elements/header}}
{{template Elements/topbar}}

<aside id="left-panel" style="height: 360px;min-height:360px;z-index:10;overflow-y:auto;overflow-x:hidden;"><!-- overflow-y:auto;overflow-x:hidden; -->
	<!-- User info 
	<div class="login-info">
		<span>
			<a id="show-shortcut" href="javascript:void(0);">
				<i class="fa fa-user"></i>
				<span>
					功能操作
				</span>
			</a> 
		</span>
	</div>
	<!-- end user info -->

	<!-- NAVIGATION : This navigation is also responsive

	To make this navigation dynamic please make sure to link the node
	(the reference to the nav > ul) after page load. Or the navigation
	will not initialize.
	-->
	<nav  id="leftmenucontent">
		{{$left_menus}}		
	</nav>
	

</aside>
<div id="ribbon">
			<!-- <span class="ribbon-button-alignment pull-right"> <span data-reset-msg="Would you like to RESET all your saved widgets and clear LocalStorage?" data-html="true" data-original-title="&lt;i class='text-warning fa fa-warning'&gt;&lt;/i&gt; Warning! This will reset all your widget settings." data-placement="bottom" rel="tooltip" data-title="refresh" class="btn btn-ribbon" id="refresh"><i class="fa fa-refresh"></i></span> </span> -->

			<div class="demo activate" style="display:none;">
				<span id="demo-setting"><i class="fa fa-cog txt-color-blueDark"></i></span> 
				<form><legend class="no-padding margin-bottom-10">Layout Options</legend><section><label><input type="checkbox" class="checkbox style-0" id="smart-fixed-nav" name="subscription"><span>Fixed header</span></label><label><input type="checkbox" class="checkbox style-0" id="smart-fixed-ribbon" name="terms"><span>Fixed Ribbon</span></label><label><input type="checkbox" class="checkbox style-0" id="smart-fixed-navigation" name="terms"><span>Fixed Navigation</span></label><label><input type="checkbox" class="checkbox style-0" id="smart-fixed-container" name="terms"><span>Inside <b>.container</b> <div class="font-xs text-right">(non-responsive)</div></span></label><label style="display:none;"><input type="checkbox" class="checkbox style-0" id="smart-rtl" name="terms"><span>Right to left <b>(rtl)</b></span></label> <span id="smart-bgimages" style="display: none;"></span></section><section><h6 class="margin-top-10 semi-bold margin-bottom-5">Clear Localstorage</h6><a id="reset-smart-widget" class="btn btn-xs btn-block btn-primary" href="javascript:void(0);"><i class="fa fa-refresh"></i> Widget Reset</a></section> <h6 class="margin-top-10 semi-bold margin-bottom-5">SmartAdmin Skins</h6><section id="smart-styles"><a style="background-color:#4E463F;" class="btn btn-block btn-xs txt-color-white margin-right-5" data-skinlogo="img/logo.png" id="smart-style-0" href="javascript:void(0);"><i id="skin-checked" class="fa fa-check fa-fw"></i>Smart Default</a><a style="background:#3A4558;" class="btn btn-block btn-xs txt-color-white" data-skinlogo="img/logo-white.png" id="smart-style-1" href="javascript:void(0);">Dark Elegance</a><a style="background:#fff;" class="btn btn-xs btn-block txt-color-darken margin-top-5" data-skinlogo="img/logo-blue.png" id="smart-style-2" href="javascript:void(0);">Ultra Light</a><a style="background:#f78c40" class="btn btn-xs btn-block txt-color-white margin-top-5" data-skinlogo="img/logo-pale.png" id="smart-style-3" href="javascript:void(0);">Google Skin</a></section></form>
			</div>
			
			<ul class="nav nav-tabs" id="main-tab-ul">
				<li class="active"><a href="#tabs-center-1" data-toggle="tab"><span>{{__('Index')}}</span> <span class="fa fa-remove"></span></a></li>
			</ul>
				<!-- breadcrumb 
				<ol class="breadcrumb"><li>Home</li><li>Dashboard</li></ol>
				end breadcrumb -->
</div>
<div  id="main" role="main">
	<div id="mainContent" style="margin:0 auto;background-color: #FFF;">
		<div id="content" style="opacity: 1;">
			<div class="tab-content" id="main-tab-content" style="padding:20px;">
				<DIV id="tabs-center-1" class="ui-corner-bottom tab-pane active" >
			          {{$content_for_layout}} <!-- 首页的tab内容 -->
			    </DIV>
		    </div>
	    </div>
	</div>
</div>
<div class="ui-layout-south" style="visibility: visible; display: block; position: absolute; margin: 0px; z-index: 2; top: auto; bottom: 0px; left: 0px; right: 0px; width: auto; height: 0px;"></div>

<div class="dialog" id="change-to" title="Change To">
	<p>{{$this->Section->getSystemsMenu('Menu')}}
	</p>
</div>

<script type="text/javascript">
mainContent_width = $("#mainContent").width();
var outerLayout;
$(document).ready( function() {
	// COLLAPSE LEFT NAV	
	$('nav ul').jarvismenu({
		accordion : true,
		speed : 200,
		closedSign : '<em class="fa fa-plus-square-o"></em>',
		openedSign : '<em class="fa fa-minus-square-o"></em>'
	});
	
	$('#main-tab-ul').delegate( "span.fa-remove", "click",function() {
		var tab_content = $( this ).closest( "a" ).attr('href');
		if($('#main-tab-ul li').size()<2){
			alert('不能小于一个哦');
			return false;
		}
		var obj = $( this ).closest( "li" ).next();
		if(obj.size()){
			obj.find('a:first').tab('show');
		}
		else{
			$( this ).closest( "li" ).prev().find('a:first').tab('show');
		}
		// 切换到最近的一个tab，然后删除本tab
		$( this ).closest( "li" ).remove();
	    $(tab_content).remove();
	});
	
	var lastmenu ='';
	$(document).on('click', '#mainContent a', function(ev) {
        var url = null;
		if($(this).data('url')){
			url = $(this).data('url');
		}
		
		if(this.href.match(/javascript:/) || this.href.match(/#/) || typeof($(this).attr('onclick'))!='undefined' || (typeof($(this).attr('target'))!='undefined' && $(this).attr('target')!='_self')){ 
			//指定了target, javascript方法或者onclick事件的直接返回，然后打开对应的链接或者执行对应的javascript
			return true;
		}
		if(!this.href.match(/#/) && typeof($(this).attr('onclick'))=='undefined' && (typeof($(this).attr('target'))=='undefined' || $(this).attr('target')=='_self')){ 
			url = this.href;
		}
		
		if(url){
			var params;
			var options = {};
			if($(this).data('width')){
				options.width = $(this).data('width');
			}
			if($(this).data('height')){
				options.height = $(this).data('height');
			}
			eval( "params= "+$(this).data('callbackargs')+";");
			open_dialog(options,url,$(this).data('callback'),params,ev);
			//open_window(url,this);
			return false;
		}
      });
		$('#leftmenucontent').find('a').addClass('ajax-link');
		$('#leftmenucontent').find('a').click(function(){
			if($(this).attr('rel')=='ajaxAction'){
				ajaxAction($(this).attr('href'));
				return false;
			}
			if(this.href.match(/#/) || typeof($(this).attr('onclick'))!='undefined' || (typeof($(this).attr('target'))!='undefined' && $(this).attr('target')!='_self')){
				return true;
			}
			
			var url = $(this).attr('href');
			var tab_title = $(this).html().replace(/<.+?>/,'');
			//alert();
			$("#leftmenucontent li.active").removeClass('active');
			$(this).parent().addClass('active');

			var st = "#maintab_"+url.replace(/\.html/g,'').replace(/http:/g,'').replace(/\/|\.|:|\?|=/g,'_');
			
			if($(st).html() != null ) {
				$('#main-tab-ul').find("li").each(function(i){
					var obja = $(this).find('a:first');
					var href = obja.attr('href');
					if(href.substring(0,1)!='#'){ //ie7,等href包含了当前的网站，去除#前面的项
						var strs = href.split("#");
						href = '#'+strs[1];
					}
					if(href==st){
						obja.tab('show');
					}
				})
			} else {
				/*if($('#main-tab-ul li').size()>=11){
					alert('最多同时打开10个选项卡页面，请关闭一些再进行打开操作。');
					return false;
				}*/
				//maintab.tabs('add',st,tab_title);
				var  tabTemplate = "<li><a href='#{href}' data-toggle='tab'><span class=\"pull-right btn btn-xs mt-5\"><span class=\"fa fa-remove\"></span></span> #{label}</a></li>";
			    var  li = $( tabTemplate.replace( /#\{href\}/g,st).replace( /#\{label\}/g, tab_title ) );
			    $( "#main-tab-ul" ).append( li );
			    $('#main-tab-content').append( "<div class='tab-pane'  id='" + st.substring(1) + "'>正在加载内容...</div>" );
			    $('#main-tab-ul').find("a:last").tab('show');
				//$(st,"#mainContent").append('<iframe width="100%" border="0" height="100%" src="'+url+'"></iframe>');
				$.ajax({
					url: url,
					type: "GET",
					dataType: "html",
					complete : function (req, err) {									
						$(st,"#main-tab-content").html(req.responseText);
						page_loaded();
						
						$(st,"#main-tab-content").find('form').each(function(){ /*对没有绑定submit事件的绑定submit世界，ajax提交*/
					    	if( typeof($(this).attr("target"))!='undefined' ){
								return true; // 当为锚点，javascript,或者定义了onclick 时，忽略动作
								// 可以使用onclick="return true;"或者target="_selft"来忽略dialog中链接的绑定事件
							}	
							
					    	if(typeof($(this).attr('onsubmit')) == "undefined"){			    		
					    		if($.fn.validate){
					    			validateForm(this);
					    		}
					    		else{
					    			$(this).on('submit',function(){
						    			ajaxSubmitForm(this);
						    			return false;
						    		})
					    		}
					    	}
					    })
						//$(st,"#main-tab-content").css({'overflow-x':'hidden','overflow-y':'auto'});
						//$(st,"#main-tab-content").height($('#main-tab-content').height());
					}
				});
			}
			return false;
		});
	
	$(window).resize(function(){
		var m_height = $(window).height()-$('#header').height() ;
		var m_width = $(window).width()-$('#ui-layout-left').width()-18 ;
		$('#left-panel').height(m_height- 5);
		/*$("#mainContent").height(m_height);
		//$("#mainContent").width(m_width);
		$('#main-tab-content').height($("#mainContent").height()-$("#main-tab-ul").height());
		
		$(".ui-tabs-panel[id^='maintab_']").each(function(){			
			$(this).height(m_height-40);
			$(this).find(".ui-jqgrid-btable[id^='jqgrid_list_']").each(function(){
				$(this).jqGrid('setGridHeight',m_height-160);
				$(this).jqGrid('setGridWidth',m_width-8);
			});
		});
		mainContent_width = $("#mainContent").width(); 
		*/
	}).trigger('resize');

	
});
</script>
{{template Elements/footer}}